/**
 * <Pagination totalSize=100 iDisplayPage=0 iDisplayLength=10 onPagination={(iDisplayPage,iDisplayLength)=>{}}/>
 **/
'use strict';

import React from 'react';
import ReactDOM from  'react-dom';
import paginationUtil from './pagination-util';
import './pagination.less'

let noop=()=>{};

export default class Pagination extends React.Component {

    static defaultProps = {
        totalSize: 0,         //
        iDisplayPage: 0,      //(require)-当前页数,默认值0
        iDisplayLength: 10,   //
        centerDisplayPage: 5, //中间显示几页
        ellipsis: '...',
        showPrev: true,       //
        showNext: true,       //
        onPagination: noop    //点击触发方法
    }

    constructor(props) {
        super(props);
        this.state = {
            iDisplayPage: props.iDisplayPage
        }
    }

    componentWillReceiveProps (nextProps) {
        this.setState({iDisplayPage: nextProps.iDisplayPage})
    }

    /**
     * virtualdom
     * @returns {XML}
     */
    render() {
        let totalPage = Math.ceil(this.props.totalSize/this.props.iDisplayLength);
        let _page = this.state.iDisplayPage >= totalPage ? totalPage-1 : this.state.iDisplayPage;

        let centerPages = paginationUtil.getDisplayPageArray(this.props.centerDisplayPage,totalPage,_page);

        let centerPagesLink = centerPages.map(item=>this._generateLink(item,_page));
        let diplayPages=[];

        diplayPages.push(<a className={"pg_prev "+ _page <= 0 ? "no_pages":""}
                            onClick={this._handlePagination.bind(this,_page-1)} href="javascript:void(0)">{'<'}</a>);

        if(totalPage <= this.props.centerDisplayPage + 2 ){//不需要显示...
            diplayPages=diplayPages.concat(centerPagesLink);
        }else if(centerPages[0] == 0){//从第0页开始的, 要在最后加...
            diplayPages=diplayPages.concat(centerPagesLink);
            diplayPages.push(this._generateLink(diplayPages.length-1,_page));
            diplayPages.push('...');
            diplayPages.push(this._generateLink(totalPage-1,_page));
        }else if(centerPages[0] == 1){//从第1页开始的, 要在最后加...
            diplayPages.push(this._generateLink(0,_page));
            diplayPages=diplayPages.concat(centerPagesLink);
            diplayPages.push(this._generateLink(diplayPages.length-1,_page));
            diplayPages.push('...');
            diplayPages.push(this._generateLink(totalPage-1,_page));
        }else if(centerPages[centerPages.length-1] == totalPage-1){//最后一页在范围内的,要在开始 加 ...
            diplayPages.push(this._generateLink(0,_page));
            diplayPages.push('...');
            diplayPages.push(this._generateLink(centerPages[0]-1,_page));
            diplayPages=diplayPages.concat(centerPagesLink);
        }else{//中间的两边都要加...
            diplayPages.push(this._generateLink(0,_page));
            diplayPages.push('...');
            diplayPages=diplayPages.concat(centerPagesLink);
            diplayPages.push('...');
            diplayPages.push(this._generateLink(totalPage-1,_page));
        }

        diplayPages.push(<a className={"pg_next " + _page >= (totalPage-1)?"no_pages":""} onClick={this._handlePagination.bind(this,_page+1)} href="javascript:void(0)">{'>'}</a>);
        return (<div className="paging_area">
            <div className="paging">
                {diplayPages}
            </div>
        </div>);
    }

    /**
     * 生成链接
     */
    _generateLink(itemNo,currentPage){
        return <a href="javascript:void(0);" className={currentPage==itemNo?"num_cur":""}  onClick={this._handlePagination.bind(this,itemNo)}  >{itemNo+1}</a>
    }

    /*
     *
     * 跳转到指定页
     * */
    _inputPageNum(){
        let dom = ReactDOM.findDOMNode(this.refs.inputPageNum);
        let num = dom.value - 1;
        this._handlePagination(num);
    }

    /**
     * 页码切换
     */
    _handlePagination(pageNum){
        const { onPagination } = this.props;
        if(pageNum >=0 && pageNum < Math.ceil(this.props.totalSize/this.props.iDisplayLength) && (pageNum!=this.state.iDisplayPage)){
            this.setState({
                iDisplayPage: pageNum
            },()=>{
                onPagination(pageNum)
            })
        }
    }
};